<template>
  <div class="bg-white _p-20 _pt-5 _mt-20">
    <div class="fz-16 title linh-48 disFlxJS">
      <div>活动报名数据</div>
    </div>
    <div class="gridBox">
      <template v-for="item in list">
        <div v-if="item.show" :key="item.label">
          <div>{{ item.label }}</div>
          <div class="fz-24 fw-6 text-dark-900">
            {{ item.value || 0 }}
          </div>
          <NumIncrease :number="item.today"></NumIncrease>
        </div>
      </template>
    </div>
  </div>
</template>

<script>
import { activityTypeEnum } from '@/enums/activity'
import NumIncrease from '../components/NumIncrease/index.vue'

export default {
  components: {
    NumIncrease
  },
  props: {
    info: {
      type: Object,
      default: () => ({})
    },
    // 主办方是否存在协办组织
    isExistJointly: {
      type: Boolean,
      default: false
    }
  },
  computed: {
    list() {
      return [
        {
          label: '本会浏览次数',
          today: this.info.todayBrowseNumByCurrentTenant,
          value: this.info.browseNumByCurrentTenant,
          show: true
        },
        {
          label: '本会浏览人数',
          value: this.info.browsePeopleNumByCurrentTenant,
          today: this.info.todayBrowsePeopleNumByCurrentTenant,
          show: true
        },
        {
          label: '本会报名人数',
          value: this.info.registerNumByCurrentTenant,
          today: this.info.todayRegisterNumByCurrentTenant,
          show: true
        },
        {
          label: '本会报名成功',
          value: this.info.passedNumByCurrentTenant,
          today: this.info.todayPassedNumByCurrentTenant,
          show: true
        },
        {
          label: '本会报名单位',
          value: this.info.companyNumByCurrentTenant,
          today: this.info.todayCompanyNumByCurrentTenant,
          show: true
        },
        {
          label: '本会已签到',
          value: this.info.registerSignNumByCurrentTenant,
          today: this.info.todayRegisterSignNumByCurrentTenant,
          show: true
        },
        {
          label: '本会待审核',
          value: this.info.waitingReviewNumByCurrentTenant,
          today: this.info.todayWaitingReviewNumByCurrentTenant,
          show: true
        }
      ]
    },
    disabled() {
      return this.info.activityType === activityTypeEnum.other_join // 协办方
    }
  },
  data() {
    return {}
  },
  methods: {}
}
</script>

<style lang="less" scoped>
.title {
  color: #1d2129;
  border-bottom: solid 1px #e5e6eb;
}
.gridBox {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-column-gap: 0.5rem;
  column-gap: 0.5rem;
  grid-row-gap: 2rem;
  row-gap: 2rem;
  text-align: center;
  padding-top: 20px;
}
</style>
